import 'package:flutter/material.dart';

class AnimateDemo extends StatefulWidget {
  const AnimateDemo({super.key});

  @override
  State<AnimateDemo> createState() => _AnimateDemoState();
}

// 单个 AnimationController 的时候使用 SingleTickerProviderStateMixin，多个 AnimationController 使用 TickerProviderStateMixin。
class _AnimateDemoState extends State<AnimateDemo>
    with SingleTickerProviderStateMixin {
  double size = 100;
  // 定义动画控制器对象
  late AnimationController _controller;

  // AnimationController 通常在 initState 方法中初始化
  @override
  void initState() {
    super.initState();
    // vsync 用于防止屏幕外动画消耗不必要的资源
    _controller = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 2),
    );

    // 监听动画帧的变化，在每一帧中调用setState来更新UI，AnimationController 的值默认是 0 到 1
    _controller.addListener(() {
      setState(() {
        // 使size从100到200
        size = 100 + 100 * _controller.value;
      });
    });

    //  监听动画的状态，当动画正序完成后反向执行动画
    _controller.addStatusListener((status) {
      // 动画状态status的值有：dismissed（动画停止在开始处）、forward（正向运行）、reverse（反向运行）、completed（动画停止在结束处）
      if (status == AnimationStatus.completed) {
        _controller.reverse();
      } else if (status == AnimationStatus.dismissed) {
        _controller.forward();
      }
    });
  }

  @override
  void dispose() {
    super.dispose();
    //释放动画
    _controller.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Center(
        //创建一个手势识别器
        child: GestureDetector(
      onTap: () {
        // 启动动画
        _controller.forward();
      },
      child: Container(
        width: size,
        height: size,
        color: Colors.blue,
        alignment: Alignment.center, // 设置文字居中
        child: const Text("点击变大"),
      ),
    ));
  }
}
